<%@ page contentType="text/html;charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="/static/common/default.jsp"%>
<html>
	<head>
	    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<link type="text/css" rel="stylesheet" href="${ctx}/static/tools/jquery-validationEngine/validationEngine.jquery.css"></link>
		<link rel="stylesheet" href="${ctx}/static/threadui/css/select_css/style.css" />
		<link rel="stylesheet" href="${ctx}/static/threadui/css/select_css/select.css" />
		<link type="text/css"  rel="stylesheet" href="${ctx}/static/threadui/css/style.css">
	    <style type="text/css">
			.select_option{
				width: 180px;
				z-index: 1;
				position: absolute;
			}
			.select_showbox{
				width: 175px;
			}
			.checkRole{
				width: 45%;
				float: left;
				border-radius: 3px;
				box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset;
				cursor: text;
				line-height:22px;
				padding: 4px 6px;
				border: 1px solid #CAC5C5;
				margin-top: 5px;
				min-height: 100px;
				height: auto;
			}
			.checkRole attr{
				color: red;
			}
			.tenant_fill{width:100%}
			.tag{
				color: white;
				margin-right: 2px;
				padding: 0.2em 0.6em 0.3em;
				border-radius: 0.25em;
				color: white;
				font-size: 95%;
				line-height: 20px;
				text-align: center;
				white-space: nowrap;
				margin-top: 1px;
			}
			.label-success{
				background-color: #29C129;
			}
			.label-default{
				background-color: #7E7575;
			}
			.tag [class="tag-remove"]::after{
				content: "x";
				padding: 0.2px;
				cursor: pointer;
				font-weight: bold;
				margin-left: 5px;
			}
			.check_cinema_li{
				background-color: #F3F8FF;
				height: 30px;
				line-height: 30px;
				margin-top: 2px;
			    padding-left: 10px;
			    cursor: pointer;
			    border-radius: 4px;
   			}
			.nocheck_cinema_li{
				background-color: #F3F8FF;
				height: 30px;
				line-height: 30px;
				margin-top: 2px;
				padding-left: 10px;
				cursor: pointer;
			    border-radius: 4px;
			}
			.checked_div{
				height: 239px;
			}
			.positionSelect .select_box{
				margin-left: 0px;
			}
			.positionSelect{
				margin-right: 50px !important;
			}
	    </style>
	</head>
	<body>
		<div class="cinema_tip">
		    <div class="cinema_subject clearfix">
		        <div class="cinema_title">
		            <a href="javascript:void(0);">用户中心</a> >
		            <a id="userinfo_list_href" href="${ctx}/sys/role/listRole">角色管理</a> >
		            <a href="javascript:void(0);" class="cinema_option">编辑角色</a>
		        </div>
		        <!-- <a onclick="javascript:history.back(-1);" class="movie_return">返回列表</a> -->
		        <a href="${ctx}/sys/sysProjectMan/ProjectInfo/toSearch" class="movie_return">返回列表</a>
		    </div>
		</div>
		<div class="cinema_list">
			<form class="form-horizontal" onsubmit="return sysRoleInfoUpdate();" role="form" id="sysRoleUpateForm" name="sysRoleUpateForm" method="post">
				<input id="roleId" type="hidden" name="roleId" value="${roleRes.role_id}" />
				<input id="roleCode" type="hidden" name="roleCode" value="${roleRes.roleCode}" />
				
				<div class="movie_list">
					<dl class="movie_fill">
						<dt class="movie_word clearfix">
							<p>角色名称：</p>
						</dt>
						<dd class="mleft_99">
							<div class="movie_type cinema_feed">
								<input id="roleName" type="text" name="roleName" value="${roleRes.roleName}" class="validate[required,maxSize[100]]" maxlength="100" />
							</div>
						</dd>
					</dl>
					
					<div class="clearfix"></div>
					<dl class="movie_fill">
						<dt class="movie_word clearfix">
							<p>权限配置：</p>
						</dt>
					</dl>
					
					<div class="cinema_list">
						<div  class="column_content">
							<div class="column_content1">
							<table id="sysUserInfoDatas" width="100%" height="" border="0" cellpadding="0" cellspacing="1" class="border_top">
								<tr style="background-color: rgb(243, 247, 255);">
									<th nowrap="" style="padding:0px 5px;width: 30px"></th>
									<th nowrap=""  colspan="2">名称</th>
						            <th nowrap="" >类型</th>
						            <th nowrap="" style="padding:0px 5px;">路径</th>
						        </tr>
						        <c:forEach var="res" items="${list}"  varStatus="status">
						        <tr class="odd" style="background-color: rgb(255, 255, 255);" id="userinfo_row_${res.resourceId}" >  
						        	<td><input type="checkbox" value="${res.resourceId}" name="resourceId"
						        	<c:forEach var="rRes" items="${rResList}"  varStatus="status">
						        		<c:choose>
							        		<c:when test="${res.resourceId ==rRes.resourceId}">checked="checked"</c:when>
						        		</c:choose>
						        	</c:forEach>
						        	/></td>  
						        
						        	<td nowrap="" colspan="2" style="padding:0px 5px;">${res.resName}&nbsp;</td>
						        	<td nowrap="" >
						        		<c:choose>
							            	<c:when test="${res.type ==1}">菜单</c:when>
							            	<c:otherwise>按钮</c:otherwise>
							            </c:choose>
						        	</td>
						        	<td nowrap="" style="padding:0px 5px;">${res.resUrl}&nbsp;</td>
						        </tr>
						        
						        <c:if test="${res.havechild ==1}">
						        <c:forEach var="res1" items="${res.list}"  varStatus="status1">
						        
						        <tr class="odd" style="background-color: rgb(255, 255, 255);" id="userinfo_row_${res1.resourceId}">
							        <td>&nbsp;</td>  
						        	<td style="padding:0px 5px;width: 30px"><input type="checkbox" value="${res1.resourceId}" name="resourceId"
						        	<c:forEach var="rRes" items="${rResList}"  varStatus="status">
						        		<c:choose>
							        		<c:when test="${res1.resourceId ==rRes.resourceId}">checked="checked"</c:when>
						        		</c:choose>
						        	</c:forEach>
						        	/></td>
						        	<td nowrap="" style="padding:0px 5px;text-align:right">${res1.resName}&nbsp;</td>
						        	<td nowrap="" >
						        		<c:choose>
							            	<c:when test="${res1.type ==1}">菜单</c:when>
							            	<c:otherwise>按钮</c:otherwise>
							            </c:choose>
						        	</td>
						        	<td nowrap="" style="padding:0px 5px;">${res1.resUrl}&nbsp;</td>
						        </tr>
						        </c:forEach>
						        </c:if>
						        
						        </c:forEach>
						    </table>
							</div>
						</div>
					</div>
					<div class="clearfix"></div>
					<a class="movie_continue">
						<input type="submit" id="submit" value="提交" class="cinema_inquiry" />
					</a>
				</div>
			</form>
		</div>
		<script type="text/javascript" src="${ctx}/static/tools/jquery-validationEngine/jquery.validationEngine.js"></script>
		<script type="text/javascript" src="${ctx}/static/tools/jquery-validationEngine/jquery.validationEngine-cn.js"></script>
		<script type="text/javascript">
			function sysRoleInfoUpdate() {
				if ($("#sysRoleUpdateForm").validationEngine("validate")) {
					var resIds_array=new Array();  
					$('input[name="resourceId"]:checked').each(function(){
						resIds_array.push($(this).val());//向数组中添加元素 
					});
					var idstr=resIds_array.join(',');//将数组元素连接起来以构建一个字符串  
					var datastr = new Object();
	    			datastr.role_id = $('#roleId').val();
	    			datastr.roleName = $('#roleName').val();
	    			datastr.roleCode = $('#roleCode').val();
	    			datastr.resourceIds = idstr;
	    			
					var result = true;
					$.ajax({
	    		        async: true,
	    		        type:"POST",
	    		        data:JSON.stringify(datastr),
	    		        url: "${ctx}/sys/role/udpate/",
	    		        dataType: "json",
	    		        headers : {  
	                        'Content-Type' : 'application/json;charset=utf-8'  
	                    },
	                    success : function(data) {
	                		if (data != undefined && data.status != undefined
	                				&& data.status.trim() == '0') {
	                			result = true;
	                			alert("角色修改成功！");
	                			window.location.href = "${ctx}/sys/role/listRole";
	                		} else {
	                			result = false;
	                			alert(data.error);
	                		}
	                	},
	    			},"json");
				}
				return false;
			}
			$(document).ready(
				/* $('input[name="resourceId"]').each(function(){
					alert(this.val());	
				}); */	
				function(){
					$('input[name="resourceId"]').each(function(){
						alert(this.val());	
					});
				}
				
			);
			
		</script>
	</body>
</html>